﻿@model Models.ProductInfo

@{
    Layout = null;
    ViewData["Title"] = "购买商品";


    var u = (ViewData["user"] as Models.Users);
    var m = u.ShippingAddress.FirstOrDefault();
    var n = ViewData["notice"] as Models.Notice;
    var s = ViewData["setting"] as List<Models.SystemSetting>;
    var cashs = ViewBag.Cash as List<Models.ItemList>;
}

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8">
    <title>@ViewData["Title"]</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <environment include="Development">
        <link rel="stylesheet" href="~/layer/css/layui.css" media="all" />
        <link rel="stylesheet" href="~/layer/css/admin.css" media="all" />
        <link rel="stylesheet" href="~/layer/css/template.css" media="all" />
        <style>
            .media img {
                display: block;
                max-width: 100%;
                height: auto;
                /*margin-top: 10px;*/
            }
        </style>
    </environment>
    <environment exclude="Development">
        <link rel="stylesheet" href="~/layer/css/layui.css" asp-append-version="true" media="all" />
        <link rel="stylesheet" href="~/layer/css/admin.css" asp-append-version="true" media="all" />
        <link rel="stylesheet" href="~/layer/css/template.css" asp-append-version="true" media="all" />
        <style>
            .media img {
                display: block;
                max-width: 100%;
                height: auto;
                /*margin-top: 10px;*/
            }
        </style>
    </environment>
</head>
<body id="iosiframe">
    @if (Model != null) {
        <div class="layui-fluid  layadmin-maillist-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12 layui-col-sm12">
                    <div class="layadmin-contact-box">
                        <div class="layui-col-md4 layui-col-sm6">
                            <a href="javascript:;">
                                <div class="layadmin-text-center">
                                    <img src="@Model.ImgUrl" style="border-radius:0;">
                                    <div class="layadmin-maillist-img layadmin-font-blod"></div>
                                </div>
                            </a>
                        </div>

                        <div class="layui-col-md8 layadmin-padding-left20 layui-col-sm6">
                            <a href="javascript:;">
                                <h1 class="layadmin-title">
                                    <strong id="name">@Model.Name</strong>
                                </h1>
                                <p class="layadmin-textimg">
                                </p>
                            </a>
                            <div class="layadmin-address">
                                <h2 class="layadmin-title">
                                    <strong style="color: #ff0000;"><i class="layui-icon layui-icon-rmb" style="font-size: 22px; color: #f7c214;"></i>&nbsp;&nbsp;@Model.Price.ToString("n") / 20箱</strong>
                                </h2>
                            </div>
                            <br />
                            <hr />
                            <br />
                            <div class="layui-form" action="" lay-filter="">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">购买数量</label>
                                    <div class="layui-input-block" style="width:50px;">
                                        <div class="layui-inline" style="display:none;"><button class="layui-btn layui-btn-primary layui-badge-rim layui-icon layui-icon-left" lay-submit="" lay-filter="mintus"></button></div>
                                        <input type="text" value="1" name="qty" placeholder="" lay-verify="required|buycount" lay-verType="tips" autocomplete="off" class="layui-input" id="qty">
                                        <div class="layui-inline" style="display:none;"><button class="layui-btn layui-icon layui-badge-rim layui-icon-right layui-btn-primary" lay-submit="" lay-filter="plus"></button></div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-input-block">
                                        <button class="layui-btn layui-icon layui-icon-cart" lay-submit="" lay-filter="buy"> 立即购买</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">商品详情</div>
                        <div class="layui-card-body media">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <script src="~/layer/layui.js"></script>
        <script>
            layui.config({
                base: '../../layer/' //静态资源所在路径
            }).extend({
                index: 'index' //主入口模块
                }).use(['form', 'upload'], function () {
                    var $ = layui.$
                        , form = layui.form;

                    var ua = navigator.userAgent.toLowerCase();
                    var screenwidth = window.screen.width;
                    if (!/iphone|ipad|ipod/.test(ua)) {
                        $("#iosiframe").attr("scrolling", "auto");
                    } else {
                        $('#iosiframe').width(screenwidth + 'px');
                    }

                    form.verify({
                        buycount: function (value) {
                            if (value.length == 0 || value == null || isNaN(value)) {
                                return '请输入正确的正数字';
                            }

                            if (value < 1) {
                                return '购买数量不能小于0';
                            }
                        }
                    });

                    form.on('submit(mintus)', function (data) {
                        var value = Number(data.field.qty);

                        value = value - 1;

                        if (value === 0) value = 1;

                        $('#qty').val(value);
                    });

                    form.on('submit(plus)', function (data) {
                        var value = Number(data.field.qty);
                        $('#qty').val(value + 1);
                    });

                    form.on('submit(buy)', function (data) {
                        var qty = $('#qty').val()
                            , price = @Model.Price;

                        if ('@ViewBag.IsSetAddress' !== 'True') {
                            window.parent.tools.msg("未设置收货地址请先设置");
                            return false;
                        } else {
                            location.href = '@Url.Action("buyproduct","order")?price=' + price + '&qty=' + qty;
                            return false;
                        }

                        @*layer.open({
                            type: 1,
                            title: '订单详情',
                            closeBtn: false,
                            shade: 0.8,
                            area: ['478px', '520px'],
                            content: $('#detail'),
                            btn: ['确认购买', '取消'],
                            btnAlign: 'c',
                            yes: function () {
                                if ($('#agreement').attr('id') && !$('#agreement').is(':checked')) {
                                    layer.msg("未同意购买协议");
                                    return;
                                }

                                if (isNaN(areaId)) areaId = 0;

                                var order = {
                                    ProductName: $('#name').text()
                                    , Receiver: $('#receiver').text()
                                    , ProvinceId: proId
                                    , CityId: cityId
                                    , AreaId: areaId
                                    , Address: $('#address').text()
                                    , Phone: $('#phone').text()
                                    , Count: qty
                                    , Price: price
                                    , Remittance: $('#Remittance').val()
                                    , RemittanceBank: $('#RemittanceBank').val()
                                    , RemittanceNo: $('#RemittanceNo').val()
                                    , RemittanceImg: $('#RemittanceImg').val()
                                }

                                $.ajax({
                                    url: '@Url.Action("saveorder", "api")',
                                    dataType: 'json',
                                    contentType: 'application/json',
                                    data: JSON.stringify(order),
                                    type: 'post'
                                }).fail(function (jqXHR, textStatus, errorThrown) {
                                    alert(errorThrown, { icon: 2, title: textStatus });
                                }).done(function (res) {
                                    layer.msg(res.message, { offset: '15px', icon: (res.code == 0 ? 1 : 2), time: 1000 }, function () {
                                        if (res.code == 0) {
                                            $('#qty').val(1);
                                            layer.closeAll();
                                            $('#Remittance').val('');
                                            $('#RemittanceBank').val('');
                                            $('#RemittanceNo').val('');
                                        }
                                    });
                                });
                            }
                        });*@
                    });

                    var HtmlUtil = {
                        /*1.用浏览器内部转换器实现html转码*/
                        htmlEncode: function (html) {
                            //1.首先动态创建一个容器标签元素，如DIV
                            var temp = document.createElement("div");
                            //2.然后将要转换的字符串设置为这个元素的innerText(ie支持)或者textContent(火狐，google支持)
                            (temp.textContent != undefined) ? (temp.textContent = html) : (temp.innerText = html);
                            //3.最后返回这个元素的innerHTML，即得到经过HTML编码转换的字符串了
                            var output = temp.innerHTML;
                            temp = null;
                            return output;
                        },
                        /*2.用浏览器内部转换器实现html解码*/
                        htmlDecode: function (text) {
                            //1.首先动态创建一个容器标签元素，如DIV
                            var temp = document.createElement("div");
                            //2.然后将要转换的字符串设置为这个元素的innerHTML(ie，火狐，google都支持)
                            temp.innerHTML = text;
                            //3.最后返回这个元素的innerText(ie支持)或者textContent(火狐，google支持)，即得到经过HTML解码的字符串了。
                            var output = temp.innerText || temp.textContent;
                            temp = null;
                            return output;
                        }
                    };

                    $('.layui-card-body.media').html(HtmlUtil.htmlDecode('@Model.Content'));
            });

            function number_format(number, decimals, dec_point, thousands_sep, roundtag) {
                /*
                * 参数说明：
                * number：要格式化的数字
                * decimals：保留几位小数
                * dec_point：小数点符号
                * thousands_sep：千分位符号
                * roundtag:舍入参数，默认 "ceil" 向上取,"floor"向下取,"round" 四舍五入
                * */
                number = (number + '').replace(/[^0-9+-Ee.]/g, '');
                roundtag = roundtag || "ceil"; //"ceil","floor","round"
                var n = !isFinite(+number) ? 0 : +number,
                    prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
                    sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
                    dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
                    s = '',
                    toFixedFix = function (n, prec) {
                        var k = Math.pow(10, prec);
                        console.log();
                        return '' + parseFloat(Math[roundtag](parseFloat((n * k).toFixed(prec * 2))).toFixed(prec * 2)) / k;
                    };
                s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
                var re = /(-?\d+)(\d{3})/;
                while (re.test(s[0])) {
                    s[0] = s[0].replace(re, "$1" + sep + "$2");
                }
                if ((s[1] || '').length < prec) {
                    s[1] = s[1] || '';
                    s[1] += new Array(prec - s[1].length + 1).join('0');
                }
                return s.join(dec);
            }
        </script>
    }
</body>
</html>
